<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>4.类型检测与转换</title>
</head>

<body>
  <div>hdcms</div>
  <div>houdunren</div>
  <script>
    let array = [1, 2, 3];
    console.log(typeof array.toString())// string
    let str = String(array)
    console.log(str);
    console.log(array.toString());
    // join 连接数组
    console.log(array.join(''));//123
    console.log(array.join('-'));//1-2-3
    console.log(`${location.href}?id=${array.join('-')}`);//http://localhost:8080/%E7%AC%AC%E5%9B%9B%E7%AB%A0:JS%E6%95%B0%E7%BB%84%E6%8C%96%E6%8E%98/4.%E7%B1%BB%E5%9E%8B%E6%A3%80%E6%B5%8B%E4%B8%8E%E8%BD%AC%E6%8D%A2.html?id=1-2-3

    //字符串拆分成数组
    let arr = str.split(",");
    console.log(arr);

    // Array from
    let str2 = 'hdcms'
    console.log(str2.length); //5 
    console.log(Array.from(str2)); //['h', 'd', 'c', 'm', 's']

    let obj = {
      0: "hdcms",
      1: "houdunren",
      length: 2
    }
    console.log(Array.from(obj)); // object 转数组 ß(2) ['hdcms', 'houdunren']
    // dom转数组
    let divs = document.querySelectorAll("div");
    console.log(divs);//NodeList(2) [div, div]
    console.log(Array.from(divs,function(item){
      console.log(item.innerHTML); // hdcms houdunren
      item.style.backgroundColor = "red";
      return item;
    }));//[div, div]
  </script>
</body>

</html>